<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="../css/beiyong.css"/>
		<script src="../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/vue.js" type="text/javascript" charset="utf-8"></script>
		<style type="text/css">
			
			.list{
				width: 100%;
				height: auto;
			}
			.list button{
				background:#7DB1FD; border:0;
			}
			.cent{
				width: 100%;
				padding: 10px 15px;
				border-bottom:1px solid #fff;
				display: flex;
				justify-content: space-between;
				align-items: center;
			}
			.himg{
				height: 50px;
				display: flex;
				align-items: center;
			}
			.himg>img{
				width: 50px;
				height: 50px;
				border-radius: 50%;
			}
			.p20{
				padding: 0 20px;
			}
		</style>
	</head>

	<body>
		
		<header class="mui-bar mui-bar-nav hbg">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		    <h1 class="mui-title">我的关注</h1>
		</header>
		
		<div class="mui-content" id="app">
			
			
			<div class="list">
				
				<div class="cent" v-for="site in list">
					
					<div class="himg">
						<img src="../images/60x60.gif"/>
						<div class="p20">昵称</div>
					</div>
					<button type="button" class="mui-btn mui-btn-blue">取消关注</button>
				</div>
				
			</div>
			
			
			
			
		</div>
		
		
		
		
		
		
		
		<script src="../js/mui.min.js"></script>
		<script type="text/javascript">
			mui.init();
			
			
			var app = new Vue({
				el: "#app",
				data: {
					list:[1,1,1],
				},
				mounted: function() {
				
				},
				methods: {

				}
			})
			
		</script>
	</body>

</html>